<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <title>服务器出现错误</title>
    <style>

        @property --bg-angle {
            inherits: false;
            initial-value: 0deg;
            syntax: "<angle>";
        }

        @keyframes spin {
            to {
                --bg-angle: 360deg;
            }
        }


        article {
            background: linear-gradient(
                    to bottom,
                    oklch(0.1 0.2 240 / 0.95),
                    oklch(0.1 0.2 240 / 0.95)
            ) padding-box, conic-gradient(
                    from var(--bg-angle) in oklch longer hue,
                    oklch(1 0.37 0) 0 0
            ) border-box;

            border: 6px solid transparent;

            &:hover {
                animation-play-state: running;
            }
        }

        * {
            box-sizing: border-box;
        }

        html {
            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica,
            Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
            font-size: 18px;
            line-height: 1.45;
        }

        body {
            margin: 0;
        }

        main {
            background: radial-gradient(circle, oklch(0.98 0 0 / 0.48), oklch(1 0 0)), linear-gradient(344deg in oklch, oklch(0.41 0.23 298.42 / 0.17), oklch(0.44 0.22 326.8), oklch(0.89 0.11 159.46 / 0));
            display: grid;
            height: 100svh;
            place-items: center;
        }

        article {
            border-radius: 1rem;
            box-shadow: 0.125rem 0.25rem 0.25rem 0.5rem oklch(0.1 0.37 315 / 0.25);
            color: white;
            padding: 1rem;
            width: min(400px, 90vw);

            & h3 {
                line-height: 1.1;
                margin: 0;
            }

            & p {
                margin: 0.75rem 0 0;
                color: #2dff66;
            }
        }</style>
</head>
<body style="background: url('/assets/user/images/bg.jpg') fixed no-repeat;background-size: cover;">
<main>
    <article>
        <h3>错误总是如影随形</h3>
        <p>
            {{ msg }}
        </p>
    </article>
</main>
</body>
</html>
